<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="Cache-Control" content="no-transform"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>中国建设银行</title>
    <link rel="stylesheet" href="css/style.css"/>
    <script type="text/javascript" src="js/zepto.min.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
</head>
<body>
<div class="indexBox">
    <div class="bg">
        <div class="opacityBg"></div>
    </div>
    <div class="tabBox">
        <div class="editTitleBox">
            <div class="title">编辑信息</div>
        </div>
        <div class="newTitleBox">
            <div class="title">客户基本信息</div>
            <ul class="tabListBox">
                <li class="tabList active">报 名</li>
                <li class="tabList ">查 询</li>
            </ul>
        </div>

        <div class="tabCon active signUpBox">
            <div class="line">
                <input class="inp" maxlength="20" type="text" placeholder="姓名"/>
            </div>
            <div class="line">
                <input class="inp" maxlength="18" type="text" placeholder="身份证"/>
            </div>
            <div class="line">
                <input class="inp" maxlength="11" type="text" placeholder="手机号"/>
            </div>
            <div class="line">
                <input class="inp" onkeyup="this.value=this.value.replace(/\D/g,'')"
                       onafterpaste="this.value=this.value.replace(/\D/g,'')" maxlength="4" type="text"
                       placeholder="银行卡后4位"/>
            </div>
            <div class="line selectBox">
                <select id="areaSelect" class="select">
                    <option value="" disabled selected>地区</option>

                </select>
                <select id="estateSelect" class="select">
                    <option value="" disabled selected>楼盘</option>

                </select>
                <select id="houseTypeSelect" class="select">
                    <option value="" disabled selected>户型</option>

                </select>
            </div>

            <div class="line">
                <input id="bondInp" class="inp" type="text" placeholder="保证金额" readonly value="保证金额：-万元"/>
            </div>

            <a id="signUpBtn" class="submitBtn" href="javascript: void(0)">立即报名</a>
        </div>
        <div class="tabCon">

            <div class="line">
                <input id="numberInp" class="inp" type="text" placeholder="手机号或者身份证号" maxlength="18"/>
                <p class="tip">
                    <span class="start">*</span>
                    <span>输入手机号或者身份证号均可查询</span>
                </p>
            </div>
            <a id="searchBtn" class="submitBtn" href="javascript: void(0)">查 询</a>

        </div>
    </div>

    <div class="searchResult">
        <div class="searchTitle">查询结果</div>
        <div class="resultCon">
            <table>
                <thead>
                <th>姓名</th>
                <th class="w50">
                    <p>身份证</p>
                    <p>后四位</p>
                </th>
                <th class="w50">
                    <p>手机号</p>
                    <p>后四位</p>
                </th>
                <th class="w50">
                    <p>银行卡</p>
                    <p>后四位</p>
                </th>
                <th>状态</th>
                <th>操作</th>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <a id="return" class="submitBtn" href="javascript: void(0)">返回</a>

    </div>
    <div class="popBox">
        <div class="popTitle">
            <p>客户须知</p>
        </div>
        <div class="popCon">
            <p>1.为保证客户权益，客户应保证填写的信息真实、有效、合法，确保申请购买人与资金冻结（扣划）账户户主一致，并保持电话畅通。</p>
            <p>2.客户提交《客户基本信息》报名后，建设银行根据客户申请并核对相关信息办理账户资金冻结手续。冻结期满后，原冻结资金自动解冻。</p>
            <p>3.客户同意并授权，建设银行根据开发商提供的扣款通知，核对相关信息办理客户资金扣划手续。</p>
            <p>4.客户同意建设银行根据开发商的解冻通知，对客户名下已冻结的资金进行解冻。</p>
            <p>5.客户同意并授权，客户拟申购楼盘开发商可通过本微信实时查询客户申请信息及资金冻结、解冻和扣划的情况。</p>
            <p>6.客户确认，凡使用密码进行的交易，均视为客户本人所为。</p>
            <div class="btnBox">
                <span class="btnbg"></span>
                <a class="sureBtn" href="javascript:void(0)">确定提交报名</a>
                <a class="cancelBtn" href="javascript:void(0)">取 消</a>
            </div>
        </div>
    </div>
</div>

</body>

</html>
